<template>
	<div id="ChancesPlan">
		<el-form :inline="true" :model="formInline" class="demo-form-inline">
			</br>
			<el-form-item label="客户名称">
				<el-input v-model="formInline.tsName" placeholder="审批人"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="danger" @click.prevent="onSuf">查询</el-button>
				<el-button type="primary" @click.prevent="onSubmit">帮助</el-button>
			</el-form-item>
		</el-form>
		<div class="line"></div>
		<template>
			<el-table :data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)" style="width: 100%"
				max-height="420">
				<el-table-column fixed prop="id" label="编号" width="100">
				</el-table-column>
				<el-table-column prop="name" label="客户名称" width="200">
				</el-table-column>
				<el-table-column prop="content" label="概要" width="120">
				</el-table-column>
				<el-table-column prop="managerName" label="联系人" width="120">
				</el-table-column>
				<el-table-column prop="phone" label="联系人电话" width="150">
				</el-table-column>
				<el-table-column prop="isSuccess" label="开发状态" width="120" :formatter="forstate"
					:filters="[{ text: '成功', value: 1 }, { text: '未成功', value: 0 }]" :filter-method="filterTag">
				</el-table-column>
				<el-table-column prop="createTime" label="创建时间" width="180">
				</el-table-column>
				<el-table-column fixed="right" label="操作" width="150">
					<template slot-scope="scope">
						<el-button @click.native.prevent="onCreate(scope.$index, scope.row)" type="text" size="small"
							:disabled="scope.row.isSuccess===1?true:false">
							制定
						</el-button>
						<el-button type="text" size="small" @click.prevent="quxiao(scope.$index, scope.row)">
							取消
						</el-button>
					</template>
				</el-table-column>
			</el-table>
		</template>
		<div class="block">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="currentPage" :page-sizes="[5, 10, 20, 40]" :page-size="pagesize"
				layout="total, sizes, prev, pager, next, jumper" :total="tableData.length">
			</el-pagination>
		</div>

	</div>
</template>

<script>
	export default {
		name: "oppoyment",
		data() {
			return {
				juese: '',
				currentPage: 1, //初始页
				pagesize: 5, //    每页的数据
				dialogFormVisible: false,
				dialogEditVisible: false,
				disabled: false,
				dialogAddVisible: false,
				user: [],
				formInline: {
					tsName: ''
				},
				tableData: []
			}
		},
		created() {
			let nowname = localStorage.getItem("reloname");
			this.juese = nowname;
			this.getUser();
			if(nowname === '销售主管'){
				this.onSuf();
				return;
			}
			this.initTable();
		},
		methods: {
			//指派
			getUser() {
				let data = {};
				this.$http.get('/sys-user/list', data).then(res => {
					this.user = res.data
				});
			},
			//表格渲染
			initTable() {
				this.$http.get('/marketing/list?name=' + localStorage.getItem("myToken")).then(res => {
					this.tableData = res.data
				});
			},
			//分页
			handleSizeChange(size) {
				this.pagesize = size;
			},
			handleCurrentChange(currentPage) {
				this.currentPage = currentPage;
			},
			//查看
			look(msg, index) {
				this.dialogFormVisible = true;
				this.form = index;
			},
			onSubmit() {
				console.log('s!');
			},
			//添加
			onCreate(index, rows) {
				var ss = rows.id
				this.$router.push({ path: '/marketing/chancesPlan/ChancesApp', query: { id: ss } });
			},
			add() {
				if (this.forma.successRate <= 0 || this.forma.successRate > 100) {
					this.$notify({
						title: '警告',
						message: '成功几率不能超过100%或小于等于0',
						type: 'warning'
					});
					this.dialogAddVisible = true
				}
				this.$http.post('/marketing/add', {
					"id": this.forma.id,
					"chancesFrom": this.forma.chancesFrom,
					"name": this.forma.name,
					"successRate": this.forma.successRate,
					"content": this.forma.content,
					"managerName": this.forma.managerName,
					"phone": this.forma.phone,
					"username": this.forma.username,
					"chancesTime": this.forma.chancesTime,
					"chancesDesc": this.forma.chancesDesc,
					"createUserId": this.forma.createUserId,
					"state": 1
				}).then(res => {
					this.$message({
						message: '恭喜你，添加成功',
						type: 'success'
					});
					this.dialogAddVisible = false
					this.initTable()
				});
			},
			//编辑
			edit(msg, index) {
				this.dialogEditVisible = true;
				this.forms = index
				if (index.state === 2) {
					this.disabled = true
				} else {
					this.disabled = false
				}
			},
			queren() {
				if (this.forms.successRate <= 0 || this.forms.successRate > 100) {
					this.$notify({
						title: '警告',
						message: '成功几率不能超过100%或小于等于0',
						type: 'warning'
					});
					this.dialogEditVisible = true
				} else {
					var state
					if (this.forms.username === null) {
						state = 1
					} else {
						state = 2
					}
					this.$http.post('/marketing/edit', {
						"id": this.forms.id,
						"chancesFrom": this.forms.chancesFrom,
						"name": this.forms.name,
						"successRate": this.forms.successRate,
						"content": this.forms.content,
						"managerName": this.forms.managerName,
						"phone": this.forms.phone,
						"username": this.forms.username,
						"chancesTime": this.forms.chancesTime,
						"chancesDesc": this.forms.chancesDesc,
						"createUserId": this.forms.createUserId,
						"state": state
					}).then(res => {
						this.$message({
							message: '恭喜你，修改成功',
							type: 'success'
						});
						this.dialogEditVisible = false
						this.initTable()
					});
				}
			},
			//查询
			onSuf() {
				this.$http.post('/marketing/query?name=' + this.formInline.tsName).then(res => {
					this.tableData = res.data
				})
			},
			deleteRow(index, rows) {
				rows.splice(index, 1);
			},
			forstate(row, column) {
				switch (row.isSuccess) {
					case 1:
						return '成功'
						break;
					case 0:
						return '未成功'
						break;
					default:
						break;
				}
			},
			filterTag(value, row) {
				return row.state === value;
			},
			//取消
			quxiao(index, row) {
				this.$http.post('/oder/update?state=' + "0" + '&id=' + row.id).then(res => {
					this.$http.post('/marketing/edit', {
						'id': row.id,
						'isSuccess': 0
					}).then(res => {
						this.initTable();
					})

				})
			}
		}
	}
</script>

<style scoped="scoped">
	#oppoyment {
		margin-left: 40px;
	}

	.line {
		background: black;
	}

	.block {
		float: right;
	}
</style>